<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Documento sin título</title>
<link href="estilos.css" rel="stylesheet" type="text/css" />
<script src="js/jquery-1.8.2.min.js" type="text/javascript"></script>
<script src="js/jquery.carouFredSel-6.0.4-packed.js" type="text/javascript"></script>
<script type="text/javascript">
$(function() {
				var thumbs = $('#thumbscarousel');

				$('#carousel').carouFredSel({
					items: 1,
					scroll: {
						fx: 'crossfade'
					},
					auto: {
						timeoutDuration: 5000,
						duration: 2000
					},
					pagination: {
						container: '#pager',
						duration: 300
					}
				});

				thumbs.carouFredSel({
					circular: false,
					auto: false,
					width: 150,
					height: 75,
					scroll: {
						duration: 200
					},
					items: {
						visible: 1,
						width: 150,
						height: 75
					}
				});

				$('#pager').hover(function() {
					var current = $('#carousel').triggerHandler( 'currentPosition' );
					thumbs.trigger( 'slideTo', [ current, 0, true, { fx: 'none' } ] );
					$('#thumbs').stop().fadeTo(300, 1);
				}, function() {
					$('#thumbs').stop().fadeTo(300, 0);
				});

				$('#pager a').mouseenter(function() {
					var index = $('#pager a').index( $(this) );

					//	clear the queue
					thumbs.trigger( 'queue', [[]] );

					//	scroll
					thumbs.trigger( 'slideTo', [index, { queue: true }] );
				});
			});
function MM_swapImgRestore() { //v3.0
  var i,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a[i])&&x.oSrc;i++) x.src=x.oSrc;
}
function MM_preloadImages() { //v3.0
  var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array();
    var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++)
    if (a[i].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}}
}

function MM_findObj(n, d) { //v4.01
  var p,i,x;  if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) {
    d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}
  if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n];
  for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document);
  if(!x && d.getElementById) x=d.getElementById(n); return x;
}

function MM_swapImage() { //v3.0
  var i,j=0,x,a=MM_swapImage.arguments; document.MM_sr=new Array; for(i=0;i<(a.length-2);i+=3)
   if ((x=MM_findObj(a[i]))!=null){document.MM_sr[j++]=x; if(!x.oSrc) x.oSrc=x.src; x.src=a[i+2];}
}
</script>
<style type="text/css" media="screen, print">
@font-face {
	font-family: Dharma Gothic C;
	src: url(fonts/DharmaGothicC-ExBold.otf);
	font-weight: ExBold;
}
@font-face {
	font-family: Steelfish;
	src: url(fonts/steelfish.ttf);
	font-weight: bold;
}
</style>
</head>

<body onload="MM_preloadImages('imagenes/volver1.png')">
<div id="menu">
  <div id="menuconte">
    <li><span><a href="#">HOME</a></span></li>
    <li><span><a href="#">SOBRE MI</a></span></li>
    <li><span><a href="#">SERVICIOS</a></span></li>
    <li><span></span></li>
    <li><span></span></li>
    <li><span><a href="#">PORTFOLIO</a></span></li>
    <li><span><a href="#">CONTACTO</a></span></li>
    <li><span><a href="#">BLOG</a></span></li>
  </div>
</div>
<div id="titulo-work"></div>
<div id="cuerpo">
  <div id="wrapper">
    <div id="carousel"> 
    <img src="imagenes/img/a1.jpg" alt="a1" width="900" height="600" border="0" /> 
    <img src="imagenes/img/a2.jpg" alt="a2" width="900" height="600" border="0" /> 
    <img src="imagenes/img/a3.jpg" alt="a3" width="900" height="600" border="0" /> 
    <img src="imagenes/img/a4.jpg" alt="a4" width="900" height="600" border="0" /> 
    <img src="imagenes/img/a5.jpg" alt="a5" width="900" height="600" border="0" /> 
    <img src="imagenes/img/a6.jpg" alt="a6" width="900" height="600" border="0" /> 
    <img src="imagenes/img/a7.jpg" alt="a7" width="900" height="600" border="0" /> 
    <img src="imagenes/img/a8.jpg" alt="a8" width="900" height="600" border="0" /> 
    <img src="imagenes/img/a9.jpg" alt="a9" width="900" height="600" border="0" /> 
    </div>
    <div id="thumbs">
      <div id="thumbscarousel"> 
      <img src="imagenes/img/small/a1.jpg" alt="a1" width="150" height="75" border="0" /> 
      <img src="imagenes/img/small/a2.jpg" alt="a2" width="150" height="75" border="0" /> 
      <img src="imagenes/img/small/a3.jpg" alt="a3" width="150" height="75" border="0" /> 
      <img src="imagenes/img/small/a4.jpg" alt="a4" width="150" height="75" border="0" /> 
      <img src="imagenes/img/small/a5.jpg" alt="a5" width="150" height="75" border="0" /> 
      <img src="imagenes/img/small/a6.jpg" alt="a6" width="150" height="75" border="0" /> 
      <img src="imagenes/img/small/a7.jpg" alt="a7" width="150" height="75" border="0" /> 
      <img src="imagenes/img/small/a8.jpg" alt="a8" width="150" height="75" border="0" /> 
      <img src="imagenes/img/small/a9.jpg" alt="a9" width="150" height="75" border="0" /> 
      </div>
    </div>
    <div id="pager"></div>
  </div>
</div>
<div id="seccion5a">
  <div id="titulotacto1">
    <div id="post1">
      <div class="postitulo">UNA PYMES CONSTRUCTIVISTA</div>
      <div class="postinfo">Publicacion sobre comunicacion tipografica para la materia
        Tipografia II, Gaitto 2012, se trato del practico final de la cursada. Projects ranged from poster and flyer design to brochure, booklet, card, editorial, advertisement and signage design.</div>
    </div>
    <div id="post2">
      <div class="postitulo">DETALLES</div>
      <div class="postinfo">
        <li>Formato: 26,5cm x 32,2cm</li>
        <li>16 Paginas</li>
        <li>2 Tintas</li>
        <li>Manual de Estilos</li>
        <li>Postales</li>
        <li>CD</li>
      </div>
    </div>
    <div id="post3">
      <div class="postitulo">WEBSITE</div>
      <div class="postinfo1">WEBSITE</div>
    </div>
    <div id="post4"><a href="#" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image25','','imagenes/volver1.png',1)"><img src="imagenes/volver.png" width="150" height="50" id="Image25" /></a></div>
  </div>
  <div id="cir"></div>
  <div id="contacto2a">
    <div id="pie">
      <div id="colu1">
        <div class="colutitu">SAY HELLO</div>
        <div class="colutitu1">DOWNLOAD CURRICULUM</div>
        <div class="coluinfo">
          <div id="coluicon">
            <div id="social1"><img src="imagenes/social.png" /></div>
            <div id="social2"><img src="imagenes/social1.png" /></div>
            <div id="social3"><img src="imagenes/social2.png" /></div>
          </div>
          <div id="coluicon1">
            <div id="social1"><img src="imagenes/social3.png" /></div>
            <div id="social2"><img src="imagenes/social4.png" /></div>
            <div id="social3"><img src="imagenes/social5.png" /></div>
          </div>
        </div>
      </div>
      <div id="colu2">
        <div class="colutitu">FAVES & FREQUENTS</div>
        <div class="colutitu1">DOWNLOAD CURRICULUM</div>
        <div class="coluinfo">
          <li><a href="#">Behance</a></li>
          <li><a href="#">Cssmania</a></li>
          <li><a href="#">Colourlovers</a></li>
          <li><a href="#">9gag</a></li>
          <li><a href="#">Taringa</a></li>
          <li><a href="#">Awwwards</a></li>
        </div>
      </div>
      <div id="colu3">
        <div class="colutitu">FRIENDS & FAMILY</div>
        <div class="colutitu1">DOWNLOAD CURRICULUM</div>
        <div class="coluinfo">
          <li><a href="#">Behance</a></li>
          <li><a href="#">Cssmania</a></li>
          <li><a href="#">Colourlovers</a></li>
          <li><a href="#">9gag</a></li>
          <li><a href="#">Taringa</a></li>
          <li><a href="#">Awwwards</a></li>
        </div>
      </div>
      <div id="colu4">
        <div class="colutitu">FEED TWITTER</div>
        <div class="colutitu1">DOWNLOAD CURRICULUM</div>
        <div class="coluinfo"></div>
      </div>
    </div>
    <div id="like"></div>
    <div id="credito">
      <div id="credito1">COPYRIGHT © 2012 BORIS VARGAS, TODOS LOS DERECHOS RESERVADOS</div>
      <div id="credito2">MADE WITH LOVE ON A PC IN PHOTOSHOP, ILLUSTRATOR & DREAMWEAVER - FONT:DOSIS PROVIDED BY GOOGLE FONTS - HOSTED BY WIROOS</div>
    </div>
  </div>
</div>
</body>
</html>
